<!--

    Copyright (c) 2015-2018 Red Hat, Inc.
    All rights reserved. This program and the accompanying materials
    are made available under the terms of the Eclipse Public License v1.0
    which accompanies this distribution, and is available at
    http://www.eclipse.org/legal/epl-v10.html

    Contributors:
      Red Hat, Inc. - initial API and implementation

-->
<che-popup title="{{editComponentDialogController.index === -1 ? 'Add a new component' : 'Edit the component'}}"
           on-close="editComponentDialogController.hide()">
  <ng-form name="editComponentForm" class="edit-component-form">
    <div class="form-input-fields">
      <che-input type="text"
                 che-form="editComponentForm"
                 che-label-name="Name"
                 che-name="name"
                 che-place-holder="Enter component's name"
                 custom-validator="editComponentDialogController.isUnique($value)"
                 ng-model="editComponentDialogController.name"
                 ng-maxlength="256"
                 required>
        <div ng-message="required">Component's name is required.</div>
        <div ng-message="customValidator">This component's name is already in use.</div>
        <div ng-message="maxlength">Component's name should be less than 256 characters long.</div>
      </che-input>
      <che-input che-form="editComponentForm"
                 che-label-name="Version"
                 che-name="version"
                 che-place-holder="Enter component's version"
                 type="text"
                 ng-model="editComponentDialogController.version"
                 ng-maxlength="256">
        <div ng-message="maxlength">Component's version should be less than 256 characters long.</div>
      </che-input>
    </div>
    <che-button-primary che-button-title="{{editComponentDialogController.index === -1 ? 'Add' : 'Save'}}"
                        ng-click="editComponentDialogController.updateComponent()"
                        ng-disabled="editComponentForm.$invalid">
    </che-button-primary>
    <che-button-notice che-button-title="Cancel"
                       ng-click="editComponentDialogController.hide()">
    </che-button-notice>
  </ng-form>
</che-popup>
